import RenderUtils from '../RenderUtils'
import typeOfUtils from "../../../utils/type-of-utils";
import {RenderTypeItem} from "../ConfigType";

const selectObject: RenderTypeItem = {
  name: 'selectObject',
  slotNames: [],
  scopedSlotsNames: ['rightSlot', 'showSlot'],
  components: {
    // @ts-ignore
    SelectObject: () => import('../../select-object'),
  },
  /**
   * 初始化自己的绑定值
   * @param vm
   * @param formItem
   */
  initFormValue(vm, formItem) {
    if (formItem.props.selectMultiple) {
      vm.$set(vm.formData, formItem.prop, [])
    } else {
      vm.$set(vm.formData, formItem.prop, {})
    }
  },
  /**
   *
   * @param createElement
   * @param vm
   * @param formItem
   * @return {VNode[]}
   */
  render(createElement, vm, formItem) {
    const config = RenderUtils.getConfig(vm, formItem, {
      on: {
        confirm: (val) => {
          if (typeOfUtils.isFunction(formItem.events?.confirm)) {
            formItem.events.confirm(val)
          }
          vm.$emit('selectChange', formItem.prop, vm.formData, {type: this.name})
        }
      }
    }, this)
    config.scopedSlots = RenderUtils.renderScopedSlots(formItem, createElement, this.scopedSlotsNames, vm)
    const children = RenderUtils.renderSlotsChildren(formItem, createElement, this.slotNames, vm)
    const item = createElement('SelectObject', config, children)
    return [item]
  }
}

export default selectObject
